﻿@{
    ViewBag.Title = "问答列表";
    Layout = Url.Content("~/Views/Shared/_Layout.cshtml");
}

@section header{
    @Styles.Render("~/Content/element-ui/lib/theme-chalk/index.css")
}

<div class="page-header">
    <h1>
        @ViewBag.Title
        <small></small>
    </h1>
</div>
<div id="PAGE_MODEL">
    <div class="row">
        <!--查询开始-->
        <div class="form-group col-sm-12">
            <form class="form-inline" v-on:submit.prevent="getXhListindex()">

                <div class=form-group>
                    <div class="input-group">
                        <span class="input-group-addon">
                            关键字查询
                        </span>
                        <input type="text" class="form-control" placeholder="输入一个关键字" id="keyword">
                    </div>
                </div>
                <div class="btn-group">
                    <button class="btn btn-primary" type="submit">
                        <i class="fa fa-fw fa-search"></i>
                        查询
                    </button>
                </div>
            </form>
        </div>
        <!--查询开始结束-->
        <!--表单开始-->
        <div class="col-md-12 table-responsive">
            <!--
            <table class="table table-bordered table-hover">
                <thead class="bg-primary">
                    <tr>
                        <th class="text-center text-nowrap">序号</th>
                        <th class="text-center text-nowrap">创建时间</th>
                        <th class="text-center">问题</th>
                        <th class="text-center">回答</th>
                    </tr>
                </thead>
                <tbody v-for="(v,index) in VmXhs" v-cloak>
                    <tr>
                        <td class="text-center">
                            <span v-text="index+1"></span>
                        </td>
                        <td class="text-center text-nowrap">{{v.updatedAt}}</td>
                        <td>{{v.query}}</td>
                        <td>{{v.answer}}</td>
                    </tr>
                </tbody>
            </table>-->

            <div class="list-group" v-for="(v,index) in VmXhs">
                <a href="#" class="list-group-item">
                    <p class="list-group-item-heading"style="color:#808080">[问:]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{v.query}}</p>
                    <br />
                    <p class="list-group-item-text" style="color:#808080"><strong>{{v.answer}}</strong></p>
                    <br />
                    <p class="list-group-item-text" style="color:#808080">{{moment(v.updatedAt).format('YYYY-MM-DD HH:mm:ss')}}</p>
                </a>
            </div>

        </div>
        <!--表单结束-->
        <!--分页开始-->
        <div class="col-md-12">
            <div class="block">
                <span class="demonstration"></span>
                <button class="btn btn-primary" type="button" v-on:click="pagePrev()">
                    上一页
                </button>
                <button class="btn btn-primary" type="button" v-on:click="pageNext()">
                    下一页
                </button>
            </div>
        </div>
        <!--分页结束-->

    </div>
</div>

@section Script{

    <script src='@Url.Content("~/Scripts/Qualification/xh.js")' type="text/javascript"></script>
    <script src='@Url.Content("~/Content/libs/moment/moment.js")' type="text/javascript"></script>

    <!-- 引入组件库 -->
    <script src='@Url.Content("~/Content/element-ui/lib/index.js")' type="text/javascript"></script>

    <script type="text/javascript">
    //链接地址定义
    var URLs = {
        URL_GET_XH: '@Url.Action("HttpClientDoGet", "Qualification")'         //获取列表
    }
    </script>
}
